<style>
    #notice-add {
        padding: 20px 25px 25px 0;
    }

    .layui-form-label {
        width: 140px;
    }

    .layui-input-block {
        margin-left: 170px;
    }

    .layui-layer-page .layui-layer-content {
        overflow: visible !important;
    }
</style>
<div class="layui-fluid" id="notice-add">
    <form class="layui-form" action="" lay-filter="notice-add-form">
        <div class="layui-form-item website-hide">
            <label class="layui-form-label website-form-item-require">发布状态：</label>
            <div class="layui-input-block">
                <input type="text" name="isPublish" value="false">
            </div>
        </div>
        <div class="layui-form-item ">
            <div class="layui-row">
                <div class="layui-col-md12">
                    <label class="layui-form-label website-form-item-require">标题：</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" lay-verify="required"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-row">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">类型：</label>
                    <div class="layui-input-block">
                        <select name="typeCode" lay-verify="required" lay-filter="changeTypeCode">
                            <option value="">请选择</option>
                            <option
                                    th:each="item : ${noticeType}"
                                    th:value="${item.code}" th:text="${item.name}">
                            </option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item website-hide" id="selectTimeDiv">
            <div class="layui-row">
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">征集开始时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="selectBeginTime" class="layui-input" readonly id="selectBeginTime">
                    </div>
                </div>
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">征集结束时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="selectEndTime" class="layui-input" readonly id="selectEndTime">
                    </div>
                </div>
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">年份：</label>
                    <div class="layui-input-block">
                        <input type="text" name="selectTimeYear" class="layui-input" readonly id="selectTimeYear">
                    </div>
                </div>
            </div>
        </div>

        <div class=" website-hide" id="jxTimeDiv">
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">结项申请开始时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="jxSelectBeginTime" class="layui-input" readonly id="jxBeginTime">
                    </div>
                </div>
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">结项申请结束时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="jxSelectEndTime" class="layui-input" readonly id="jxEndTime">
                    </div>
                </div>
            </div>
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">年份：</label>
                    <div class="layui-input-block">
                        <input type="text" name="jxYear" class="layui-input" readonly id="jxYear">
                    </div>
                </div>
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">期次：</label>
                    <div class="layui-input-block">
                        <select name="planNo">
                            <option value=""></option>
                            <option
                                    th:each="item : ${planNos}"
                                    th:value="${item.code}" th:text="${item.name}">
                            </option>
                        </select>
                    </div>
                </div>

            </div>
        </div>

        <div class="website-hide" id="jxjgDiv">
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">期次：</label>
                    <div class="layui-input-block">
                        <select name="period">
                            <option value="">请选择</option>
                            <option
                                    th:each="item : ${topicPlan}"
                                    th:value="${item.period}" th:text="${item.period}">
                            </option>
                        </select>
                    </div>
                </div>
            </div>
        </div>

        <div class="website-hide" id="lxDiv">
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">年份：</label>
                    <div class="layui-input-block">
                        <input type="text" name="lxYear" class="layui-input" readonly id="lxYear">
                    </div>
                </div>
            </div>
        </div>
        <div class="website-hide" id="nlxDiv">
            <div class="layui-row layui-form-item">
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">年份：</label>
                    <div class="layui-input-block">
                        <input type="text" name="nlxYear" class="layui-input" readonly id="nlxYear">
                    </div>
                </div>
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">拟立项开始时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="nlxBeginTime" class="layui-input" readonly id="nlxBeginTime">
                    </div>
                </div>
                <div class="layui-col-md4">
                    <label class="layui-form-label website-form-item-require">拟立项结束时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="nlxEndTime" class="layui-input" readonly id="nlxEndTime">
                    </div>
                </div>
            </div>
        </div>

        <div class="website-hide" id="submitTimeDiv">
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">提交开始时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="submitBeginTime" class="layui-input" readonly id="submitBeginTime">
                    </div>
                </div>
                <div class="layui-col-md6">
                    <label class="layui-form-label">意向表结束时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="intentionSubmitEndTime" class="layui-input" readonly
                               id="intentionSubmitEndTime">
                    </div>
                </div>

            </div>
            <div class="layui-row layui-form-item">
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">年份：</label>
                    <div class="layui-input-block">
                        <input type="text" name="submitYear" class="layui-input" readonly id="submitYear">
                    </div>
                </div>
                <div class="layui-col-md6">
                    <label class="layui-form-label website-form-item-require">申请表结束时间：</label>
                    <div class="layui-input-block">
                        <input type="text" name="applySubmitEndTime" class="layui-input" readonly
                               id="applySubmitEndTime">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-row">
                <div class="layui-col-md12">
                    <label class="layui-form-label">附件：</label>
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn layui-btn-sm" id="uploadItemFile"
                                style="margin-top: 6px;">
                            <i class="layui-icon">&#xe67c;</i>上传文件
                        </button>
                        <div id="filename" class="layui-form-mid layui-word-aux"></div>
                        <input type="hidden" id="fileId" name="fileId">
                        <button type="button" class="layui-btn layui-btn-sm" id="delfile" lay-submit=""
                                lay-filter="delFile"
                                style="margin-top: 6px;">删除
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-row">
                <div class="layui-col-md12">
                    <label class="layui-form-label website-form-item-require">内容：</label>
                    <div class="layui-input-block">
                        <textarea name="content" lay-verify="required" placeholder="请输入内容" rows="10"
                                  class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item website-hide">
            <button class="layui-btn" lay-submit="" lay-filter="notice-add-form-submit" id="submit"></button>
            <button type="reset" class="layui-btn" id="reset"></button>
        </div>
    </form>
</div>

<script data-th-inline="javascript">
    layui.use(['website', 'form', 'validate', 'laydate', 'upload'], function () {
        var $ = layui.$,
            website = layui.website,
            layer = layui.layer,
            form = layui.form,
            planList = [[${topicPlan}]],
            laydate = layui.laydate,
            upload = layui.upload,
            validate = layui.validate;

        form.verify(validate);
        form.render();
        //初始化时间
        laydate.render({
            elem: '#selectBeginTime' //指定元素
            , type: 'date',
            trigger: 'click',
            value: new Date()

        });
        laydate.render({
            elem: '#submitBeginTime' //指定元素
            , type: 'date',
            trigger: 'click',
            value: new Date()
        });
        laydate.render({
            elem: '#nlxBeginTime' //指定元素
            , type: 'date',
            trigger: 'click',
            value: new Date()
        });
        laydate.render({
            elem: '#nlxEndTime' //指定元素
            , type: 'date',
            trigger: 'click'
        });

        laydate.render({
            elem: '#selectEndTime', //指定元素
            trigger: 'click',
            type: 'date',
        });

        laydate.render({
            elem: '#jxBeginTime' //指定元素
            , type: 'date',
            trigger: 'click',
            value: new Date()

        });

        laydate.render({
            elem: '#jxEndTime' //指定元素
            , type: 'date',
            trigger: 'click',
        });

        laydate.render({
            elem: '#jxYear' //指定元素
            , type: 'year',
            trigger: 'click',
            value: new Date()
        });

        laydate.render({
            elem: '#lxYear' //指定元素
            , type: 'year',
            trigger: 'click',
            value: new Date()
        });

        laydate.render({
            elem: '#submitYear' //指定元素
            , type: 'year',
            trigger: 'click',
            value: new Date()
        });

        laydate.render({
            elem: '#selectTimeYear' //指定元素
            , type: 'year',
            trigger: 'click',
            value: new Date()
        });
        laydate.render({
            elem: '#nlxYear' //指定元素
            , type: 'year',
            trigger: 'click',
            value: new Date()
        });
        laydate.render({
            elem: '#applySubmitEndTime' //指定元素
            , type: 'date',
            trigger: 'click',
        });
        laydate.render({
            elem: '#intentionSubmitEndTime' //指定元素
            , type: 'date',
            trigger: 'click',
        });


        //执行实例
        upload.render({
            elem: '#uploadItemFile' //绑定元素
            , url: '/upload' //上传接口
            , accept: 'file' //指定允许上传时校验的文件类型，可选值有：images（图片）、file（所有文件）、video（视频）、audio（音频）
            , size: 100 * 1024
            , exts: false //指定后缀名 更多参数请到这里https://www.layui.com/doc/modules/upload.html
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , done: function (res) {
                //上传后的文件名回显到input框
                $("#filename").html("<a href='" + ctx + "download/" + res.data.fileId + "'>" + res.data.name + "</a>");
                $("#fileId").val(res.data.fileId);
                layer.closeAll('loading'); //关闭loading
            }
            , error: function () {
                //请求异常回调
                layer.closeAll('loading'); //关闭loading
            }
        });


        $("#delfile").click(function () {
            var fileId = $("#fileId").val();
            if (!fileId) {
                website.alert.info('您还未上传文件！');
            } else {
                website.modal.confirm('删除', '确实要删除吗？', function () {
                    $("#filename").text("");
                    $("#fileId").val("");
                });
            }
            return false;
        })

        /**
         * 监听状态的改变事件
         */
        form.on('select(changeTypeCode)', function (data) {
            $("#selectTimeDiv").addClass("website-hide");
            $("#submitTimeDiv").addClass("website-hide");
            $("#jxTimeDiv").addClass("website-hide");
            $("#jxjgDiv").addClass("website-hide");
            $("#nlxDiv").addClass("website-hide");
            $("#lxDiv").addClass("website-hide");
            if (data.value === "notice_type_ktzj") {
                $("#selectTimeDiv").removeClass("website-hide");
            } else if (data.value === "notice_type_ktzn") {
                $("#submitTimeDiv").removeClass("website-hide");
            } else if (data.value === "notice_type_jxgg") {
                $("#jxTimeDiv").removeClass("website-hide");
            } else if (data.value === "notice_type_jxjggg") {
                if (!planList || planList.length == 0) {
                    website.alert.error('对不起，没有要创建的结项课题！');
                    return false;
                }
                $("#jxjgDiv").removeClass("website-hide");
            } else if (data.value === "notice_type_nlxgg") {
                $("#nlxDiv").removeClass("website-hide");
            } else if (data.value === "notice_type_lxgg") {
                $("#lxDiv").removeClass("website-hide");
            } else {
                $("#nlxDiv").addClass("website-hide");
            }
        });

        form.on('submit(notice-add-form-submit)', function (data) {
            if (data.field.typeCode === "notice_type_ktzj") {
                if (!data.field.selectTimeYear) {
                    website.alert.error('请输入征集年份！');
                    return false;
                }
                if (!data.field.selectBeginTime) {
                    website.alert.error('请输入征集开始时间！');
                    return false;
                }
                if (!data.field.selectEndTime) {
                    website.alert.error('请输入征集结束时间！');
                    return false;
                }
                var beginTime = new Date(data.field.selectBeginTime);
                var endTime = new Date(data.field.selectEndTime);
                if (beginTime.getTime() > endTime.getTime()) {
                    website.alert.error('对不起，结束时间要大于开始时间！');
                    return false;
                }
                data.field.year = data.field.selectTimeYear


            } else if (data.field.typeCode === "notice_type_jxgg") {
                let jxSelectBeginTime = data.field.jxSelectBeginTime;
                let jxSelectEndTime = data.field.jxSelectEndTime;
                let jxYear = data.field.jxYear;
                if (!jxYear) {
                    website.alert.error('请输入结项年份！');
                    return false;
                }
                if (!data.field.planNo) {
                    website.alert.error('请选择期次！');
                    return false;
                }

                if (!jxSelectBeginTime) {
                    website.alert.error('请输入结项开始时间！');
                    return false;
                }
                if (!jxSelectEndTime) {
                    website.alert.error('请输入结项结束时间！');
                    return false;
                }
                var beginTime = new Date(jxSelectBeginTime);
                var endTime = new Date(jxSelectEndTime);
                if (beginTime.getTime() > endTime.getTime()) {
                    website.alert.error('对不起，结束时间要大于开始时间！');
                    return false;
                }
                data.field.selectBeginTime = jxSelectBeginTime;
                data.field.selectEndTime = jxSelectEndTime;
                data.field.year = jxYear;

            } else if (data.field.typeCode === "notice_type_ktzn") {
                if (!data.field.submitBeginTime) {
                    website.alert.error('请输入提交开始时间！');
                    return false;
                }
                if (!data.field.submitYear) {
                    website.alert.error('请输入年份！');
                    return false;
                }
                if (!data.field.applySubmitEndTime) {
                    website.alert.error('请输入申请表结束时间！');
                    return false;
                }


                var submitBeginTime = new Date(data.field.submitBeginTime);
                var applySubmitEndTime = new Date(data.field.applySubmitEndTime);
                var intentionSubmitEndTime = new Date(data.field.intentionSubmitEndTime);

                if (submitBeginTime.getTime() > applySubmitEndTime.getTime()) {
                    website.alert.error('对不起，申请表结束时间要大于开始时间！');
                    return false;
                }
                if (data.field.intentionSubmitEndTime) {
                    if (submitBeginTime.getTime() > intentionSubmitEndTime.getTime()) {
                        website.alert.error('对不起，意向表结束时间要大于开始时间！');
                        return false;
                    }
                }

                data.field.year = data.field.submitYear;
            } else if (data.field.typeCode === "notice_type_jxjggg") {
                if (!planList || planList.length == 0) {
                    website.alert.error('对不起，没有要创建的结项课题！');
                    return false;
                }

                if (!data.field.period) {
                    website.alert.error('请输入期次！');
                    return false;
                }
            } else if (data.field.typeCode === "notice_type_nlxgg") {

                if (!data.field.nlxYear) {
                    website.alert.error('请输入拟立项年份！');
                    return false;
                }
                if (!data.field.nlxBeginTime) {
                    website.alert.error('请输入拟立项开始时间！');
                    return false;
                }
                if (!data.field.nlxEndTime) {
                    website.alert.error('请输入拟立项结束时间！');
                    return false;
                }
                var beginTime = new Date(data.field.nlxBeginTime);
                var endTime = new Date(data.field.nlxEndTime);
                if (beginTime.getTime() > endTime.getTime()) {
                    website.alert.error('对不起，结束时间要大于开始时间！');
                    return false;
                }
                data.field.year = data.field.nlxYear
                data.field.preItemEndTime=data.field.nlxEndTime;
                data.field.preItemBeginTime=data.field.nlxBeginTime;

            }else if(data.field.typeCode === "notice_type_lxgg"){
                if (!data.field.lxYear) {
                    website.alert.error('请输入立项年份！');
                    return false;
                }
                data.field.year = data.field.lxYear
            }
            website.post(ctx + 'notice', data.field, function () {
                layer.closeAll();
                website.alert.success('新增通知公告成功');
                $('#website-notice').find('#query').click();
            });
            return false;
        });
    });
</script>